@import './variables.scss';
/*大屏调整*/
$white: #bfcbd9!important;
$transparent: transparent!important;
$color1: rgba(32, 96, 172, .1)!important;
$color2: #304156!important;
$color3: #1f2d3d!important;
$color4: rgba(35, 95, 167, .3) !important;
$color5: rgba(10, 119, 251, .3) !important;
$bgColor: #0c315f;
$boxShowdow: 0 0 10px #2e49ac inset !important;
html, body, input, textarea, select {
  background-color: $transparent;
}
#app .sidebar-container {
  background-color: rgba(23, 64, 121, .5) !important;
}
#app .sidebar-container .submenu-title-noDropdown:hover, #app .sidebar-container .el-submenu__title:hover {
  background-color: rgba(48,65,186,0.2) !important;
}
.sidebar-container .submenu-title-noDropdown:hover, .sidebar-container .el-submenu__title:hover {
  background-color: rgba(48,65,186,0.2) !important;
}
#app .sidebar-container .nest-menu .el-submenu>.el-submenu__title:hover, #app .sidebar-container .el-submenu .el-menu-item:hover{
  background-color: rgba(48,65,186,0.2) !important;
}
.app-container{
  padding: 10px 1px 0!important;
}
.filter-container{
  margin: 0 0 10px 0;
  padding: 10px 10px 0;
  border-radius: 4px;
  /*box-shadow: 0 0 10px inset #306fcf;*/
  background: rgba(32, 96, 172, 0.1);
}
.filter-container .el-form-item--mini.el-form-item{
  margin: 0;
}
.global-scree-style{
  position: relative;
  padding: 50px 20px 0;
  box-shadow: 0 0 100px inset #235fa7;
}
.global-background-color {
  background-color:  $menuBg!important; /* 浏览器不支持的时候显示 */
  background-image: url("../assets/images/login_bg2.jpg");
  background-image: radial-gradient(#2466b2  10%, #060f30);
  background-size: cover ;
  background-repeat: no-repeat;
}

.navigation-style{
  margin: 50px 0 20px 20px;
  padding: 0;
  height: calc(100% - 10px);
  border-radius: 4px;
  box-shadow: 0 0 10px #475ff5;
}
#app .main-container {
  margin-left: 220px;
}
.datav-style {
  padding: 3px;
  border-radius: 4px;
  box-shadow: $boxShowdow;
  background: rgba(32, 96, 172, 0.1);
}
.tags-view-container{
  background: $transparent;
  border-color: $color4;
}
.tags-view-wrapper{
  .btn-con{
    background: $transparent;
    border: none!important;
    button {
      color: $white;
      background: $transparent;
      border: inherit!important;
    }

  }
}
.el-tabs--border-card{
  background: transparent!important;
  border: none!important;
  box-shadow: 0 0 10px #2e49ac inset !important;
}
.el-tabs--border-card>.el-tabs__header {
  background-color: transparent!important;
  border-bottom: 1px solid #283f6f;
  margin: 0;
}
/*#pane-flowChartXml,*/
.el-tabs__content{
  .el-tab-pane[aria-labelledby*="tab-flowChartXml"]{
    background: #FFFFFF;
    border-radius: 8px;
  }
}
.el-input__inner,
.el-textarea__inner{
  color: $white;
  border-color: $color5;
  background: $color4;
}
.el-tabs--border-card>.el-tabs__header .el-tabs__item.is-active {
  color: #1890ff;
  background-color: transparent!important;
  border-right-color: #283f6f;
  border-left-color: #283f6f;
}
.el-radio,
.el-tabs__item,{
  color: #c1cccc!important;
}
.el-tabs__item.is-active{
  color: #409EFF!important;
}
.el-collapse-item__wrap {
  background: transparent !important;
}
.element-icons-list .d2-icon-select--class-row .d2-icon-select--class-col:hover,
.d2-icon-select--group .d2-icon-select--class .d2-icon-select--class-row .d2-icon-select--class-col:hover{
  color: #1890ff;
  background-color: transparent!important;
  border-radius: 4px;
  font-size: 45px;
  -webkit-box-shadow: inset 0px 0px 0px 1px;
  box-shadow: inset 0px 0px 0px 1px;
}
.el-collapse-item__header{
  background: transparent!important;
  color: #c1cccc !important;
}
.el-input.is-disabled .el-input__inner{
  background-color: #184579 !important;
  border-color: #1453a0 !important;
  /*color: #767b87 !important;*/
}
.el-form-item__label{
  color: #cdcccc !important;
}
.el-dialog {
  box-shadow: $boxShowdow;
  background: rgba(19, 57, 104, 0.85) !important;
}
.el-button--default {
  color: $white;
  background-color: #4e6b8d81!important;
  border-color: #4e6b8d!important;
}
.el-button--primary {
  color: #bfc4d7;
  background-color: #188fff6e!important;
  border-color: #1890ff!important;
}
.el-checkbox__inner{
  background: #ffffff21!important;
  border-color: #4e6b8d !important;
}
.el-checkbox__input.is-disabled .el-checkbox__inner {
  background-color: #38689f !important;
  border-color: #4e6b8d !important;
  cursor: not-allowed!important;
}
.el-link--inner,
.el-date-editor .el-range-separator{
  color: #b3b6bb !important;
}
.el-divider__text,
.el-dialog__title,
.el-textarea .el-input__count,
.el-input__count .el-input__count,
.el-transfer-panel,
.el-transfer-panel__item.el-checkbox,
.el-transfer-panel .el-transfer-panel__header,
.el-transfer-panel .el-transfer-panel__header .el-checkbox .el-checkbox__label,
.el-transfer-panel .el-checkbox__inner,
.el-input .el-input__count .el-input__count-inner,
.el-pager li,
.el-pagination button:disabled,
.el-pagination .btn-prev, .el-pagination .btn-next{
  color: $white;
  background: $transparent;
}
.el-dialog__headerbtn .el-dialog__close{
  color: $white;
}
.el-table__body tr.hover-row>td,
.el-table__body tr.hover-row.current-row>td,
.el-table__body tr.hover-row.el-table__row--striped>td,
.el-table__body tr.hover-row.el-table__row--striped.current-row>td,
.el-table__body tr.current-row>td,
.el-table--enable-row-hover .el-table__body tr:hover>td{
  background: $color1;
}
.el-table--striped .el-table__body tr.el-table__row--striped td{
  background: transparent!important;
}
.el-pagination__total,
.el-pagination__jump{
  color: $white;
}
.el-input-group__append,
.el-input-group__prepend{
  background: $color1;
  border-color: $color1;
}
.el-divider{
  background: $color1;
}
.vue-treeselect__control,
.vue-treeselect__menu,
.vue-treeselect__menu div,
.el-dropdown-menu {
  color: $white;
  background: rgba(24,65,116,0.7)!important;
  border-color: $color1;
}
.tags-view-container .tags-view-wrapper .tags-view-item {
  color: #c1c0c0 !important;
  background: $color1;
  border-color: $color4;
  border-radius: 4px!important;
  box-shadow: $boxShowdow;
}
.tags-view-container .tags-view-wrapper .tags-view-item.active{
  color: #62c1ee !important;
}
.el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content,
.el-tree-node__content:hover,
.el-dropdown-menu__item:not(.is-disabled):hover, .el-dropdown-menu__item:focus{
  color: #62c1ee!important;
  background: $transparent;
  box-shadow: 0 0 10px inset rgba(66, 105,233, .2) !important;
}
.vue-treeselect__menu div:hover,
.el-select-dropdown__item.hover,
.el-select-dropdown__item:hover{
  background: rgba(78, 107, 141, .3) !important;
}
.el-dialog__body{
  color: #cdcccc !important;
}
.el-select-dropdown__list{
  background: $color1;
  border-color: $color4;
  border-radius: 4px!important;
  box-shadow: $boxShowdow;
}
.el-select-dropdown{
  color: #ddf1ff !important;
  border-color: rgba(10, 119, 251, 0.3) !important;
  background: rgba(22, 62, 120, .6) !important;
}
.el-select-dropdown__item{
  color: #e1edf3 !important;
  font-weight: normal;
}
.el-dropdown-link,
.el-link.el-link--info{
  color: #b3b6bb !important;
}
.el-message-box{
  box-shadow: 0 0 10px #2e49ac !important;
  background: rgba(19,57,104,0.85) !important;
}
.el-message-box__title,
.el-message-box__content{
  color: $white;
}
.el-dropdown-menu__item--divided {
  border: none!important;
}
.cancelButtonClass{
  background: #a6a9ad!important;
  border-color: #a6a9ad!important;
  color: #e7ebef !important
}
.el-date-editor .el-range-input{
  color: $white;
}
.el-radio-button:not(.is-active) .el-radio-button__inner{
  background: #a6a9ad!important;
  border-color: #a6a9ad!important;
  color: #eef1f5!important;
}
.el-dropdown-menu__item{
  color: $white;
}
.element-icons-list .d2-icon-select--class-row .d2-icon-select--class-col,
.d2-icon-select--group .d2-icon-select--class .d2-icon-select--class-row .d2-icon-select--class-col{
  color: $white;
}
.element-icons-list .d2-icon-select--class-row .d2-icon-select--class-col:hover,
.d2-icon-select--group .d2-icon-select--class .d2-icon-select--class-row .d2-icon-select--class-col:hover{
  color: #1890ff!important;
}
.el-tabs__nav-wrap::after {
  background: rgba(255,255,255,.1)!important;
}
.logo-style {
  position: relative;
  .animation{
    position:absolute;
    top: 0;
    width:200px;
    height:50px;
  }
}

.el-table,
.el-tree{
  color: rgb(191, 203, 217) !important;
  box-shadow: $boxShowdow;
  background: rgba(32,96,172,0.1) !important;
}
.el-table {
  thead {
    box-shadow: $boxShowdow;
    tr {
      /*box-shadow: 0 0 10px inset #306fcf;*/
      th{
        color: #60bdef;
        background: rgba(58, 102, 155, 0.5) !important;
        &:first-child {
          background: rgba(58, 102, 155, 0.8) !important;
        }
        &:last-child {
          background: rgba(58, 102, 155, 0.8) !important;
        }
      }
    }
  }
  tr{
    color: $white;
    background: rgba(32,96,172,0.1) !important;
    &:nth-child(n){
      background: rgba(20, 83, 172, 0.6) !important;
    }
    &:nth-child(2n){
      background: rgba(32,96,172,0.8) !important;
    }
    td {
      border-bottom: 1px solid rgb(22, 84, 162) !important;
    }
  }
}
.el-table th.is-leaf, .el-table td {
  border-bottom: 1px solid rgba(32, 91, 161, .5) !important;
}
.el-table--group, .el-table--border,
.el-table--border th, .el-table--border td {
  border: none !important;
}
.el-table__fixed-right-patch {
  position: absolute;
  top: -1px;
  right: 0;
  background-color: transparent!important;
  border-bottom: none!important;
}
.el-table__fixed::before, .el-table__fixed-right::before,
.el-table--group::after, .el-table--border::after, .el-table::before {
  background: transparent!important;
}
.el-message{
  border:rgba(10,119,251,0.3) !important;
  box-shadow: 0 0 10px inset #7186d1 !important;
  background: rgba(32,96,172, .9) !important;
}

.avatar-uploader .el-upload {
  border: 1px dashed rgba(32,96,172, .5) !important;
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}
.avatar-uploader .el-upload:hover {
  border-color: rgba(32, 96, 172, 1) !important;
}
.el-table--enable-row-transition .el-table__body td:last-child:not(.is-hidden){
  background: rgba(20, 57, 110, .8)!important;
}
.el-table--enable-row-transition .el-table__body td:first-child:not(.is-hidden){
  background: rgba(29, 83, 157, .8)!important;
}
.el-dialog__body{
  .el-table--enable-row-transition .el-table__body td:first-child:not(.is-hidden){
    background: rgba(29, 83, 157,.3)!important;
  }
  .el-table--enable-row-transition .el-table__body td:last-child:not(.is-hidden){
    background: transparent!important;
  }
  .el-table--enable-row-transition .el-table__body tr:hover {
    background: rgba(29, 83, 157, .5)!important;
    cursor: pointer;
  }
}
.sidebar-container{
   background-color: transparent!important;
   height: calc(100% - 61px) !important;
   padding: 3px !important;
  .svg-icon {
    margin-right: 10px;
  }
   &.has-logo {
     .el-scrollbar {
       height: 100% !important;
     }
   }
   .submenu-title-noDropdown,
   .el-submenu__title {
     margin: 1px 0;
     box-shadow: 0 0 15px inset #2e49ac !important;
     &:hover {
       background-color: $menuHover !important;
     }
   }
 }
.el-tree-node:focus>.el-tree-node__content{
  background: transparent!important;
}
.el-tabs--card>.el-tabs__header {
  border-bottom: 1px solid #18417a!important;
}
.el-tabs--card>.el-tabs__header .el-tabs__item.is-active {
  border-bottom-color: #18417a!important;
}
.el-tabs--card>.el-tabs__header .el-tabs__nav {
  border: 1px solid #183f75!important;
  border-bottom: none!important;
}
.el-popper[x-placement^="bottom"] .popper__arrow::after{
  border-bottom-color: #1d4c8c!important;
}
.el-popper[x-placement^="top"] .popper__arrow::after {
  border-top-color: #1d4c8c!important;
}
.el-transfer-panel,
.el-transfer-panel .el-transfer-panel__header{
  border: 1px solid rgba(255,255,255,.1) !important;
}
.container {
  width: 300px;
  height: 100px;
  overflow: auto;
}
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
  /*background-color: #ddd;*/
}
.CodeMirror,
.tui-editor-defaultUI-toolbar{
  background: transparent!important;
  color: #FFF!important;
}
.tui-editor-defaultUI,
.te-toolbar-section{
  border: 1px solid #587ac4!important;
}
.tui-editor-defaultUI-toolbar button {
  border:none!important;
  box-shadow: 0 0 10px #2e49ac inset !important;
}
.tui-toolbar-divider{
  background-color: #2e49ac!important;
}
.el-picker-panel,
.el-time-panel,
.el-picker-panel__footer,
.el-time-panel__footer,{
  box-shadow: 0 0 10px #2e49ac inset !important;
  background: rgba(19,57,104,0.85) !important;
  color: #cccccc;
}
.el-date-table th,
.el-date-picker__header-label,
.el-month-table td .cell,
.el-year-table td .cell,
.el-picker-panel__icon-btn,
.el-time-panel__btn,
.el-time-spinner__item{
  background: rgba(19,57,104,0.85) !important;
  color: #ababab;
}

.el-time-spinner__item.active:not(.disabled){
color: #1890ff!important;
}
.el-date-picker__time-header,
.el-picker-panel__footer,
.el-date-range-picker__time-header,
.el-date-range-picker__content.is-left{
  border: 1px solid #e4e4e426!important;
}
.el-date-table td.next-month, .el-date-table td.prev-month {
  color: #808082!important;
}
.el-upload-list__item-name,
.el-upload-list__item .el-icon-close{
  color: $white;
}
.el-upload-list__item:hover {
  box-shadow: 0 0 10px #2e49ac inset !important;
  background: rgba(19,57,104,0.85) !important;
}
/*滑块*/
::-webkit-scrollbar-thumb {
  background-color: rgba(66, 105,233, .5) !important;
  border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
  background-color: rgba(66, 105,233, .9) !important;
}
.center-container{
  border: none!important;
}
.containers,
.center-container .el-main{
  background: transparent!important;
}

/*滑道*/
::-webkit-scrollbar-track {
  box-shadow: 0 0 10px inset rgba(66, 105,233, .2) !important;
  border-radius: 10px;
}
